<template>
  <div class="collect">
    <fuChuangZi></fuChuangZi>
    <van-card >
      <div slot="thumb" class="thumb">
        <van-image fit="cover" width="200rpx" height="200rpx"      src="/static/images/icon.jpg"></van-image>
      </div>
      <div slot="tags" class="tags">
        <span>好评率：90%</span>
        <van-rate value= 4.5 allow-half="true"	 count= 5 readonly="true"></van-rate>
      </div>
      <div slot="desc" class="desc">
        <div>快递公司：顺丰快递</div>
      </div>
      <div slot="title" class="title">
        <span class="title-1">商品标题：abcdefghijk</span>
        <span class="price">5-10/时</span>
      </div>
      <div slot="bottom" class="bottom">
        <van-icon name="/static/images/icon/position.png"></van-icon>
        <span>成信大</span>
        <span class="time">
          <van-button round type="info" size="mini" plain >取消收藏</van-button>
          <van-icon name="/static/images/icon/shoucang.png" size="40rpx"></van-icon>
        </span>
      </div>
    </van-card>
    <van-card >
      <div slot="thumb" class="thumb">
        <van-image fit="cover" width="200rpx" height="200rpx"      src="/static/images/icon.jpg"></van-image>
      </div>
      <div slot="tags" class="tags">
        <span>好评率：90%</span>
        <van-rate value= 4.5 allow-half="true"	 count= 5 readonly="true"></van-rate>
      </div>
      <div slot="desc" class="desc">
        <div>快递公司：顺丰快递</div>
      </div>
      <div slot="title" class="title">
        <span class="title-1">商品标题：abcdefghijk</span>
        <span class="price">5-10/时</span>
      </div>
      <div slot="bottom" class="bottom">
        <van-icon name="/static/images/icon/position.png"></van-icon>
        <span>成信大</span>
        <span class="time">
          <van-button round type="info" size="mini" plain >取消收藏</van-button>
          <van-icon name="/static/images/icon/shoucang.png" size="40rpx"></van-icon>
        </span>
      </div>
    </van-card>
    <van-card >
      <div slot="thumb" class="thumb">
        <van-image fit="cover" width="200rpx" height="200rpx"      src="/static/images/icon.jpg"></van-image>
      </div>
      <div slot="tags" class="tags">
        <span>好评率：90%</span>
        <van-rate value= 4.5 allow-half="true"	 count= 5 readonly="true"></van-rate>
      </div>
      <div slot="desc" class="desc">
        <div>快递公司：顺丰快递</div>
      </div>
      <div slot="title" class="title">
        <span class="title-1">商品标题：abcdefghijk</span>
        <span class="price">5-10/时</span>
      </div>
      <div slot="bottom" class="bottom">
        <van-icon name="/static/images/icon/position.png"></van-icon>
        <span>成信大</span>
        <span class="time">
          <van-button round type="info" size="mini" plain >取消收藏</van-button>
          <van-icon name="/static/images/icon/shoucang.png" size="40rpx"></van-icon>
        </span>
      </div>
    </van-card>
    <van-card >
      <div slot="thumb" class="thumb">
        <van-image fit="cover" width="200rpx" height="200rpx"      src="/static/images/icon.jpg"></van-image>
      </div>
      <div slot="tags" class="tags">
        <span>好评率：90%</span>
        <van-rate value= 4.5 allow-half="true"	 count= 5 readonly="true"></van-rate>
      </div>
      <div slot="desc" class="desc">
        <div>快递公司：顺丰快递</div>
      </div>
      <div slot="title" class="title">
        <span class="title-1">商品标题：abcdefghijk</span>
        <span class="price">5-10/时</span>
      </div>
      <div slot="bottom" class="bottom">
        <van-icon name="/static/images/icon/position.png"></van-icon>
        <span>成信大</span>
        <span class="time">
          <van-button round type="info" size="mini" plain >取消收藏</van-button>
          <van-icon name="/static/images/icon/shoucang.png" size="40rpx"></van-icon>
        </span>
      </div>
    </van-card>
    <van-card >
      <div slot="thumb" class="thumb">
        <van-image fit="cover" width="200rpx" height="200rpx"      src="/static/images/icon.jpg"></van-image>
      </div>
      <div slot="tags" class="tags">
        <span>好评率：90%</span>
        <van-rate value= 4.5 allow-half="true"	 count= 5 readonly="true"></van-rate>
      </div>
      <div slot="desc" class="desc">
        <div>快递公司：顺丰快递</div>
      </div>
      <div slot="title" class="title">
        <span class="title-1">商品标题：abcdefghijk</span>
        <span class="price">5-10/时</span>
      </div>
      <div slot="bottom" class="bottom">
        <van-icon name="/static/images/icon/position.png"></van-icon>
        <span>成信大</span>
        <span class="time">
          <van-button round type="info" size="mini" plain >取消收藏</van-button>
          <van-icon name="/static/images/icon/shoucang.png" size="40rpx"></van-icon>
        </span>
      </div>
    </van-card>
    <van-card >
      <div slot="thumb" class="thumb">
        <van-image fit="cover" width="200rpx" height="200rpx"      src="/static/images/icon.jpg"></van-image>
      </div>
      <div slot="tags" class="tags">
        <span>好评率：90%</span>
        <van-rate value= 4.5 allow-half="true"	 count= 5 readonly="true"></van-rate>
      </div>
      <div slot="desc" class="desc">
        <div>快递公司：顺丰快递</div>
      </div>
      <div slot="title" class="title">
        <span class="title-1">商品标题：abcdefghijk</span>
        <span class="price">5-10/时</span>
      </div>
      <div slot="bottom" class="bottom">
        <van-icon name="/static/images/icon/position.png"></van-icon>
        <span>成信大</span>
        <span class="time">
          <van-button round type="info" size="mini" plain >取消收藏</van-button>
          <van-icon name="/static/images/icon/shoucang.png" size="40rpx"></van-icon>
        </span>
      </div>
    </van-card>
    <van-card >
      <div slot="thumb" class="thumb">
        <van-image fit="cover" width="200rpx" height="200rpx"      src="/static/images/icon.jpg"></van-image>
      </div>
      <div slot="tags" class="tags">
        <span>好评率：90%</span>
        <van-rate value= 4.5 allow-half="true"	 count= 5 readonly="true"></van-rate>
      </div>
      <div slot="desc" class="desc">
        <div>快递公司：顺丰快递</div>
      </div>
      <div slot="title" class="title">
        <span class="title-1">商品标题：abcdefghijk</span>
        <span class="price">5-10/时</span>
      </div>
      <div slot="bottom" class="bottom">
        <van-icon name="/static/images/icon/position.png"></van-icon>
        <span>成信大</span>
        <span class="time">
          <van-button round type="info" size="mini" plain >取消收藏</van-button>
          <van-icon name="/static/images/icon/shoucang.png" size="40rpx"></van-icon>
        </span>
      </div>
    </van-card>
    <van-card >
      <div slot="thumb" class="thumb">
        <van-image fit="cover" width="200rpx" height="200rpx"      src="/static/images/icon.jpg"></van-image>
      </div>
      <div slot="tags" class="tags">
        <span>好评率：90%</span>
        <van-rate value= 4.5 allow-half="true"	 count= 5 readonly="true"></van-rate>
      </div>
      <div slot="desc" class="desc">
        <div>快递公司：顺丰快递</div>
      </div>
      <div slot="title" class="title">
        <span class="title-1">商品标题：abcdefghijk</span>
        <span class="price">5-10/时</span>
      </div>
      <div slot="bottom" class="bottom">
        <van-icon name="/static/images/icon/position.png"></van-icon>
        <span>成信大</span>
        <span class="time">
          <van-button round type="info" size="mini" plain >取消收藏</van-button>
          <van-icon name="/static/images/icon/shoucang.png" size="40rpx"></van-icon>
        </span>
      </div>
    </van-card>
    <van-card >
      <div slot="thumb" class="thumb">
        <van-image fit="cover" width="200rpx" height="200rpx"      src="/static/images/icon.jpg"></van-image>
      </div>
      <div slot="tags" class="tags">
        <span>好评率：90%</span>
        <van-rate value= 4.5 allow-half="true"	 count= 5 readonly="true"></van-rate>
      </div>
      <div slot="desc" class="desc">
        <div>快递公司：顺丰快递</div>
      </div>
      <div slot="title" class="title">
        <span class="title-1">商品标题：abcdefghijk</span>
        <span class="price">5-10/时</span>
      </div>
      <div slot="bottom" class="bottom">
        <van-icon name="/static/images/icon/position.png"></van-icon>
        <span>成信大</span>
        <span class="time">
          <van-button round type="info" size="mini" plain >取消收藏</van-button>
          <van-icon name="/static/images/icon/shoucang.png" size="40rpx"></van-icon>
        </span>
      </div>
    </van-card>
  </div>
</template>

<script>

  import fuChuangZi from '../../components/fuChuangZi/fuChuangZi.vue'
export default {
    components: {
      fuChuangZi
    },
  data () {
    return {

      }
    }
  }



</script>

<style lang="stylus" rel="stylesheet/stylus">
.collect
  van-card
    width 100%
    height 200rpx
    border-bottom 1rpx solid rgb(235, 237, 240)
    margin-bottom 5rpx
    .title
      .title-1
        font-weight bold
      .price
        display inline-block
        float right
    .desc
      display block
      width 100%
      height 40rpx
      margin-top 10rpx
    .bottom
      display block
      width 100%
      margin-top 10rpx
      height 40rpx
      line-height 40rpx
      van-icon
        display inline-block
        line-height 40rpx
      .time
        display inline-block
        float right
        line-height 40rpx
        width 200rpx
        height 40rpx
        van-button
          display inline-block
          line-height 40rpx
          margin-left 35rpx
        van-icon
          float right
    .tags
      display: inline-block
      margin-bottom 5rpx
      height 50rpx
      span
        font-size 30rpx
        display inline-block
        height 60rpx
        line-height 60rpx
        margin-right 30rpx
        margin-bottom  5rpx
      van-rate
        display inline-block
        height 60rpx
        line-height 60rpx
</style>
